import React from "react";
import { Integral } from "./style";

const no = require("../../assets/icon_k.png");

export default class Index extends React.PureComponent {
  state = {
    myIntegrals: "1"
  };
  componentDidMout() {}
  render() {
    return (
      <Integral>
        {this.state.myIntegrals ? (
          <div className="integral">
            <div className="total">
              <span>
                <i className="iconfont">&#xe61e;</i>我的积分 <b>1350分</b>
              </span>
              <span>今日可获得积分+1</span>
            </div>
            <p className="tips">
              注：10积分=0.5元奖励，
              <br />
              积分可在微信公众号找客服换取红包，500积分起兑
            </p>
            <ul>
              <li>
                <div className="left">
                  <h2>
                    <i className="iconfont">&#xe64d;</i>分享
                  </h2>
                  <div className="time">时间：2019-03-23</div>
                </div>
                <div className="right">
                  美丽打卡大作战<p>积分+1</p>
                </div>
              </li>

              <li>
                <div className="left">
                  <h2>
                    <i className="iconfont">&#xe62b;</i>
                    学习
                  </h2>
                  <div className="time">时间：2019-03-23</div>
                </div>
                <div className="right">
                  美丽打卡大作战<p>积分+1</p>
                </div>
              </li>

              <li>
                <div className="left">
                  <h2>
                    <i className="iconfont">&#xe667;</i>
                    打卡
                  </h2>
                  <div className="time">时间：2019-03-23</div>
                </div>
                <div className="right">
                  美丽打卡大作战<p>积分+1</p>
                </div>
              </li>
            </ul>
          </div>
        ) : (
          <div className="no">
            <img width="40" src={no} alt="空" />
            <p>呀，还没有获得积分，打卡或学习就能获得积分 立即学习(*^_^*)</p>
          </div>
        )}
      </Integral>
    );
  }
}
